<template>
  <div>
  <el-divider content-position="left"><span style="font-size: 1.15rem;">班级成绩录入</span><span style="margin-left: 2rem;margin-right:1rem;"></span>
    <template>
      <el-select v-model="value" clearable placeholder="选择班级" size="medium" @change="changbj" @clear="clear">
        <el-option
          v-for="item,idx in options"
          :key="idx"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </template>

    <span style="margin-left: 2rem;margin-right:1rem;"></span>
    <template>
      <el-select v-model="value2" clearable placeholder="选择课程" size="medium" @change="changkc" @clear="clear1">
        <el-option
          v-for="item,idx in options1"
          :key="idx"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </template>
    <el-button icon="el-icon-search" type="primary" circle style="margin-left: 1.725rem;" plain size="medium" :disabled="(!this.pageParams.bjId)||(!this.pageParams.kcId)" @click="btnClick"></el-button>
  </el-divider>

  <el-row v-if="button">
      <my-table  listPath="grade/page" savePath="" deletePath="" :table="table" :pageParams="pageParams" :dialogForm="form" :rules="rules"   :pageSize="[5,10,20,35,50]" :btns="btns">
        <template v-slot:tableColumn >
           <el-table-column width="350px" >
              <template slot="header" slot-scope="scope">
                  <span>成绩</span>
              </template>
              <template slot-scope="scope">
                   <el-input-number v-model="scope.row.grade" controls-position="right" @change="setFixedTel(scope.row)" :min="0" :max="200"></el-input-number>
              </template>
          </el-table-column>
        </template>
      </my-table>
  </el-row>

  </div>
</template>

<script>
  import myTable from '../../components/myTable.vue';
  export default{
    components:{myTable},
    data() {
      return {
        value:'',
        value2:'',
        options:[],
        options1:[],
        pageParams:{
          limit:10,
          page:1,
          sort:'id',
          order:'asc',
          search:'',
          bjId:'',
          kcId:''
        },
        button:false,
        table:[
          {
            title:'学号',
            field:'student.stuNo'
          },
          {
            title:'姓名',
            field:'student.name'
          },
        ],
        row:{

        },
        form:{},
        rules:{},
        btns:false
      }
    },
    methods:{

      btnClick(){
        this.button=false;
        this.$nextTick(() => {
             this.button=true
        });
      },
      clear(){
        this.button=false;
        this.pageParams.bjId='';
        console.log(this.pageParams.bjId)
      }
      ,
      clear1(){
        this.button=false;
        this.pageParams.kcId='';
      }
      ,
      changbj(val){

        this.pageParams.bjId=val
        this.button=false
      },
      changkc(val){
        this.pageParams.kcId=val
        this.button=false
      },
      setFixedTel(row){
        this.row.id=row.id;
        this.row.grade=row.grade;
        this.$ajax.post("grade/classCjxg",this.row).then(res=>{
          var result = res.data;
          if(result.success){
             this.$notify.success({
                  title: '提示',
                  message: '成绩修改成功',
                  position: 'bottom-right'
              });
          }
      })
      }
    },
    created() {
		var role =window.sessionStorage.getItem("role")
			if(role==='ROLE_STUDENT'){
				this.$router.back();
		}
		
      this.$ajax.post("tbClass/list",{}).then(res=>{
        var result = res.data;
        if(result.success)
          this.options=result.data;
        })

         this.$ajax.post("course/list",{}).then(res=>{
                var result = res.data;
                if(result.success){
                this.options1=result.data;
                }
         })
      }

  }
</script>

<style>
</style>
